<template>
	<view>
		<view class="list pl25 pr25 box c000">
			<view class="pl20 pr20 bb box flex flex-ac" style="height: 150rpx;">
				<view class="it1 flex flex-ac">
					<text style="font-weight: bold;">头像</text>
				</view>
				<view class="flex flex-ac" @click="uphead">
					<image v-if="headImg!=undefined" :src="headImg" style="width: 120rpx;height: 120rpx;border-radius: 50%;margin-right: 20rpx;"></image>
					<image v-else src="../../static/images/mrtx.png" style="width: 120rpx;height: 120rpx;border-radius: 50%;margin-right: 20rpx;"></image>
					<image class="arrow" src="http://tuozhen1.oss-cn-beijing.aliyuncs.com/ueditor/upload/weixin/images/arrow.png"></image>
				</view>
			</view>
			<view class="pl20 pr20 bb box flex flex-ac" style="height: 150rpx;">
				<view class="it1 flex flex-ac">
					<text style="font-weight: bold;">姓名</text>
				</view>
				<view class="flex flex-ac">
					{{name}}
				</view>
			</view>
			<view class="pl20 pr20 bb box flex flex-ac" style="height: 150rpx;">
				<view class="it1 flex flex-ac">
					<text style="font-weight: bold;">身份证号码</text>
				</view>
				<view class="flex flex-ac">
					{{identity}}
				</view>
			</view>
			<view class="pl20 pr20 bb box flex flex-ac" style="height: 150rpx;">
				<view class="it1 flex flex-ac">
					<text style="font-weight: bold;">手机号码</text>
				</view>
				<view class="flex flex-ac">
					{{phone}}
				</view>
			</view>
			<view class="pl20 pr20 bb box flex flex-ac" style="height: 150rpx;">
				<view class="it1 flex flex-ac">
					<text style="font-weight: bold;">民族</text>
				</view>
				<view class="flex flex-ac">
					{{race}}
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				wx: "https://app.mzmzb.com",
				personalFileId:null,
				usrUserId:null,
				headImg: undefined,
				avatarUrl:'http://tuozhen1.oss-cn-beijing.aliyuncs.com/ueditor/upload/weixin/images/user.png',
				name:'',
				identity:'',
				phone:'',
				race:'',
			};
		},
		onLoad(option) {
			this.personalFileId = option.personalFileId;
			this.queryUsrInfo();
		},
		onShow() {
			
		},
		methods: {
			uphead(){
				var that = this
				uni.chooseImage({
					count: 9, // 默认9
					sizeType: ['original', 'camera'], // 可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
					success: function(res) {
						uni.showLoading({
							title: '上传中...'
						});
						// 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片
						var tempFilePaths = res.tempFilePaths
						var myDate = new Date()
						var ossPath = 'ueditor/upload/weixin/' + myDate.getFullYear()
						var fileKeylist = []
						for (var i = 0; i < tempFilePaths.length; i++) {
							// 获取文件后缀
							//var pathArr = tempFilePaths[i].split('.')
							const imgsrc = res.tempFilePaths[i];
							const index = imgsrc.lastIndexOf(".");
							const imgExtension = imgsrc.substring(index + 1, imgsrc.length);
							console.log("后缀：" + imgExtension)
							//  随机生成文件名称
							var fileRandName = Date.now() + "" + parseInt(Math.random() * 1000)
							var fileName = fileRandName + '.' + imgExtension
							// 要提交的key
							var fileKey = ossPath + '/' + fileName
							fileKeylist.push(fileKey)
							uni.uploadFile({
								url: 'https://tuozhen1.oss-cn-beijing.aliyuncs.com/',
								filePath: tempFilePaths[i],
								name: 'file',
								formData: {
									name: tempFilePaths[i],
									key: fileKey,
									policy: 'eyJleHBpcmF0aW9uIjoiMjMzNy0wNC0xM1QwMjo0MjoxMi40ODFaIiwiY29uZGl0aW9ucyI6W1siY29udGVudC1sZW5ndGgtcmFuZ2UiLDAsMTA0ODU3NjAwMF0sWyJzdGFydHMtd2l0aCIsIiRrZXkiLCJ1ZWRpdG9yL3VwbG9hZC93ZWl4aW4vIl1dfQ==',
									OSSAccessKeyId: 'Te5npXFe8IdIxPgQ',
									signature: 'I1Dv3FioQ4hoBh0ui2Rvsax+fAI=',
									success_action_status: "200"
								},
								success: function(res) {
									console.log(res)
								}
							})
						}
						setTimeout(function() {
							that.getImgs(fileKeylist);
						}, 5000);
					}
				})
			},
			getImgs(e) {
				var that = this;
				var imgLists = []
				// if (uni.getStorageSync('imgs').length != 0) {
				// 	for (var j = 0; j < uni.getStorageSync('imgs').length; j++) {
				// 		imgLists.push(uni.getStorageSync('imgs')[j])
				// 	}
				// }
				let upliadImages = ''
				for (var i = 0; i < e.length; i++) {
					upliadImages = "http://tuozhen1.oss-cn-beijing.aliyuncs.com/" + e[i];
					// console.log("携带的参数：" + upliadImages)
					// imgLists.push(upliadImages);
				}
			let openid=uni.getStorageSync('openId')
			let userId=uni.getStorageSync('usrUserId')
			let data={
					usrPersonalId: this.personalFileId,
					imgUrl: upliadImages
				}
			that.func.$request('wx/updateUsrPersonalHeadImg.tz',data,'GET').then(res=>{
				if (res.data.success) {
					uni.hideLoading()
					uni.showToast({
						title: '修改成功!'
					})
					this.headImg = upliadImages
				}else{
					uni.hideLoading()
					uni.showToast({
						title: '上传失败!',
						icon: 'error'
					})
				}
			})
				// that.Imgs = imgLists
			},
			queryUsrInfo(){
				var that = this;
				that.func.$request('queryUsrInfo.tz',{usrPersonalId: this.personalFileId},'GET').then(res=>{
					if (res.data.success) {
						console.log(res)
						that.headImg=res.data.result.headImg;
						that.name=res.data.result.name;
						that.identity=res.data.result.identity;
						that.phone=res.data.result.phone;
						that.race=res.data.result.race;
					} else {
						uni.showToast({
							title: '查询失败'
						})
					}
				})	
			}
		}
	};
</script>

<style lang="less">
	button::after{
		border:none;
	}
	.contact-btn {
	  display: inline-block;
	  position: absolute;
	  width: 100%;
	  background: salmon;
	    opacity: 0;
	}
	.ft10{
		font-size: 20rpx;
	}
	.c083fdc{
		color: #083fdc;
	}
	.user{
		width: 100%;
		height: 480rpx;
		background: #74a6fd;
		border-radius: 0 0 15rpx 5rpx;
		box-shadow: 10rpx 10rpx 10rpx 0 rgba(173,173,173,0.37);
		padding-top: 75rpx;
		.set{
			width: 42rpx;
			height: 42rpx;
			position: absolute;
			top: 35rpx;
			right: 30rpx;
			z-index: 10;
		}
		.head{
			width: 145rpx;
			height: 145rpx;
			border-radius: 50%;
			margin: 0 auto;
			display: block;
		}
		.type{
			padding:50rpx;
		}
	}
	.list{
		>view{
			height: 110rpx;
		}
		.typeimg{
			width: 30rpx;
			height: 30rpx;
		}
	}
</style>
